<template>
    <div id="templateDiv">
        <Spin size="large" fix v-if="LoadingDiv"></Spin>
        <Form :label-width="120" inline>
            <Form-item label="属地区划:">
                <Select v-model="queryParam.yjag0001" style="width:200px" clearable>
                    <Option v-for="item in countyList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                </Select>
            </Form-item>
            <Form-item label="低保类型:">
                <Select v-model="queryParam.yjag0002" style="width:200px" clearable>
                    <Option value="100">城市低保</Option>
                    <Option value="200">农村低保</Option>
                </Select>
                <Button type="primary" style="margin-left: 10px" @click="extract">提取标准</Button>
            </Form-item>
            <Form-item label="" :label-width="10">
                <Input v-model="queryParam.yjag0016" :disabled="true" placeholder="原救助标准"/>
            </Form-item>
            <Form-item label="预测调标金额:">
                <InputNumber v-model="queryParam.yjag0015" style="width: 200px" placeholder="请输入预测调标金额"></InputNumber>

            </Form-item>
            <Row class="button_row">
                <span style="float: right;">
              <Button type="primary" style="" @click="calculate" icon="ios-search">预测计算</Button>
                    <!--<Button type="primary" style="margin-left: 8px" @click="searchReset">重置</Button>-->
             </span>
            </Row>
        </Form>

        <div class="table_div">
            <vxe-table border
                       auto-resize
                       row-id="id"
                       :row-key="true"
                       show-overflow="tooltip"
                       highlight-hover-row
                       align="center"
                       header-align="center"
                       ref="xTree"
                       :loading="Loading"
                       :data="tableData">
                <vxe-table-column field="create_date" title="预测日期" align="center" width="200"
                                  :formatter="renderTime"/>
                <vxe-table-column field="yjag0001_name" title="区划" align="center" width="200"/>
                <vxe-table-column field="yjag0002_name" title="低保类别" align="center" width="200"/>
                <vxe-table-column field="yjag0016" title="原保障标准" align="center" width="200"/>
                <vxe-table-column field="yjag0015" title="预测调标金额" align="center" width="200"/>
                <vxe-table-column field="yjag0003" title="原总金额" align="center" width="200"/>
                <vxe-table-column field="yjag0004" title="原总户数" align="center" width="200"/>
                <vxe-table-column field="yjag0005" title="原总人数" align="center" width="200"/>
                <vxe-table-column field="yjag0008" title="预测低保增加金额" align="center" width="200"/>
                <vxe-table-column field="yjag0009" title="预测低保边缘升档低保户数" align="center" width="200"/>
                <vxe-table-column field="yjag0010" title="预测低保边缘升档低保人数" align="center" width="200"/>
                <vxe-table-column field="yjag0011" title="预测低保边缘升档低保增加金额" align="center" width="220"/>
                <vxe-table-column field="yjag0006" title="预测增加总金额" align="center" width="200"/>
                <vxe-table-column field="yjag0012" title="总金额" align="center" width="200"/>
                <vxe-table-column field="yjag0013" title="总户数" align="center" width="200"/>
                <vxe-table-column field="yjag0014" title="总人数" align="center" width="200"/>
                <vxe-table-column title="操作" align="center" width="350" fixed="right">
                    <template #default="{row}">
                        <Button type="default" @click="handleDetail(row)" style="margin-left: 10px">查看</Button>
                        <Button type="default" @click="handleChart(row)" style="margin-left: 10px">图形分析</Button>
                        <Button type="default" @click="handleDelete(row.id)" style="margin-left: 10px">删除</Button>
                    </template>
                </vxe-table-column>
            </vxe-table>
            <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                  @on-change="handleTableChange" :current="pageNo"></Page>
        </div>
        <ss02030-chart ref="modalChart"/>
        <ss02030-modal ref="modalForm"/>
    </div>
</template>
<script>
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import {postAction} from '@/api/request'
    import ss02030Chart from './modules/ss02030Chart'
    import ss02030Modal from './modules/ss02030Modal'

    export default {
        name: "ss02030List",
        mixins: [CommonMixin],
        components: {ss02030Chart, ss02030Modal},
        data() {
            return {
                url: {
                    list: "/api/ac/subsistence/Ss02030Service/page",
                    delete: "/api/ac/subsistence/Ss02030Service/delete",
                    extract: "/api/ac/subsistence/Ss02030Service/extract",
                    calculate: "/api/ac/subsistence/Ss02030Service/insertCalculate",
                    area: "/api/ac/subsistence/ss01001Service/xzqhList",
                },
                Loading: true,
                LoadingDiv: false,
                countyList: [],
                queryParam: {
                    yjag0001: "",
                    yjag0002: "",
                    yjag0015: null,
                    yjag0016: "",
                },

            }
        },
        methods: {
            handleChart(row) {
                this.$refs.modalChart.edit(row);
                this.$refs.modalChart.title = "图形分析";
                this.$refs.modalChart.disableSubmit = true;
                this.$refs.modalChart.key = this.uuid();
            },
            getArea() {
                var that = this;
                if (sessionStorage.getItem("area_linkage")) {
                    that.areaList = JSON.parse(sessionStorage.getItem("area_linkage"));
                    that.countyList = that.areaList.xqdata;
                } else {
                    postAction(that.url.area, {}).then((res) => {
                        that.areaList = res.data.data;
                        sessionStorage.setItem("area_linkage", JSON.stringify(that.areaList));
                        that.countyList = res.data.data.xqdata;
                    })
                }
            },
            extract() {
                var that = this;
                if (!this.queryParam.yjag0001) {
                    this.$Message.error("请选择县/区！");
                    return false;
                }
                if (!this.queryParam.yjag0002) {
                    this.$Message.error("请选择低保类型！");
                    return false;
                }
                // this.LoadingDiv = true;
                var parmas = new Object();
                parmas.yjag0001 = this.queryParam.yjag0001;
                parmas.yjag0002 = this.queryParam.yjag0002;
                postAction(this.url.extract, parmas).then((res) => {
                    if (res.data.errcode != 0) {
                        that.$Message.error(res.data.errmsg);
                    } else {
                        that.queryParam.yjag0016 = res.data.data;

                    }
                }).finally(() => {
                    that.LoadingDiv = false;
                })
            },

            calculate() {
                var that = this;
                if (!this.queryParam.yjag0001) {
                    this.$Message.error("请选择县/区！");
                    return false;
                }
                if (!this.queryParam.yjag0002) {
                    this.$Message.error("请选择低保类型！");
                    return false;
                }
                if (!this.queryParam.yjag0016) {
                    this.$Message.error("请提取标准！");
                    return false;
                }
                if (!this.queryParam.yjag0015) {
                    this.$Message.error("请填写预测调标金额！");
                    return false;
                }
                that.LoadingDiv = true;
                var parmas = new Object();
                parmas.yjag0001 = this.queryParam.yjag0001;
                parmas.yjag0002 = this.queryParam.yjag0002;
                parmas.yjag0015 = this.queryParam.yjag0015;
                parmas.yjag0016 = this.queryParam.yjag0016;
                postAction(this.url.calculate, parmas).then((res) => {
                    if (res.data.errcode != 0) {
                        that.$Message.error(res.data.errmsg);
                    } else {
                        that.loadData();
                        // that.queryParam.yjag0016 = res.data.data;
                    }
                }).finally(() => {
                    that.LoadingDiv = false;
                })
            },
        },
        created() {
            this.getArea();
            this.loadData();
        },
    }
</script>

<style scoped>
    /*#area :nth-child(2) {*/
    /*display: none;*/
    /*}*/
    /*#area :nth-child(3) {*/
    /*display: none;*/
    /*}*/
</style>
